<template>
  <div class="img-box">
	  <div class="camera">
	    <!-- <img src="/src/assets/camera-fill.svg" style="width: 40px;" /> -->
		<input type="file" class="file-input" accept="image/*" @change="uploadBackImg" multiple/>
	  </div>
	  <div v-if="fileList.length>0 && showName">
		  <ul>
		  	<li v-for="item in fileList">{{item.name}}</li>
		  </ul>
	  </div>
  </div>
</template>

<script>
  export default {
    name: 'gzimgload',
	props: {
		showName:{
			type: Boolean,
			default: false
		}
	},
    data() {
      return {
        fileList: [],
      }
    },
    methods: {
     uploadBackImg(e) {
      this.fileList = e.target.files
      this.$emit('getFiles',this.fileList)
      }
    }
  }
</script>

<style lang="less" scoped>
	.img-box{
	  text-align: center;
	  .camera{
	    border-radius: 50%;
	    background-color: rgba(90, 143, 255, 0.9);
		padding:5px;
		display: inline-block;
		position: relative;
	  }
	}

</style>
